<template>
   <div  style="margin:10px;">
       
        <a-card  v-if="flowParam" title="环节信息">

            <a-list item-layout="horizontal" size="small" style="padding-left:20px;">
                <a-list-item >
                流程名称：{{flowParam.templateName}}
                </a-list-item>
                <a-list-item >
                当前环节：{{flowParam.currentNodeAttribute.nodeLabel}}
                </a-list-item>
                <template v-if="flowParam.startNode!=flowParam.currentNodeAttribute.nodeNo">
                    <a-list-item >
                        提交人：{{flowParam.currentTask.submitEmpName}}
                    </a-list-item>
                    <a-list-item >
                        提交时间：{{flowParam.currentTask.startTime}}
                    </a-list-item>
                </template>
                
            </a-list>
         
            <br/>
            <ExtForm ref="flowForm" :formfields="formfields" @changeEventHandler="changeEventHandler" @clickEventHandler="clickEventHandler"></ExtForm>
          
        
        </a-card>

         <a-card title="审批信息" v-if="approvalOpinions.length>0">
            <a-timeline>
                <a-timeline-item v-for="(opinion, idx) in approvalOpinions" :key="idx">
                    <a-icon v-if="opinion.approvalState == flowSetting.constant.审批通过" slot="dot" type="check-circle" style="font-size: 16px;" />
                    <a-icon v-else slot="dot" type="close-circle" style="font-size: 16px;" />
                    <a-row>
                        <a-col :span="8">
                            <template v-if="opinion.profilePicture">
                                <!-- {{defaultSettings.fileServer}} -->
                                <a-avatar size="large" :src="defaultSettings.fileServer + '/' + opinion.profilePicture"></a-avatar>
                            </template>
                            <template v-else>
                                <a-avatar size="large" :src="require('/src/assets/default_photo.png')"></a-avatar>

                            </template>
                            <!-- <template v-if="opinion.userAvatar">
                                <a-avatar size="large"
                                    :src="defaultSettings.fileServer + '/' + opinion.userAvatar"></a-avatar>
                            </template>
                            <template v-else>
                                <a-avatar size="large" :src="require('/src/assets/default_photo.png')"></a-avatar>
                            </template> -->
                            <div>{{ opinion.approvalEmpName }}</div>
                            <div>{{ opinion.currentNodeLabel }}</div>
                        </a-col>
                        <a-col :span="16">
                            {{ opinion.approvalTime }}
                            <div>{{ opinion.approvalOpinion }}</div>
                            <!-- <div>
                                <template v-if="opinion.userSign">
                                    <img style="width:80px;"
                                        :src="defaultSettings.fileServer + '/' + opinion.userSign" />
                                </template>
                            </div> -->
                        </a-col>

                    </a-row>

                </a-timeline-item>
            </a-timeline>
        </a-card>
        
        <drEmpSelect ref="singleEmpSelect" @onSelect="onSingleEmpSelect"></drEmpSelect>
        <empTransfer ref="empTransfer" @getSelected="onMoreEmpSelect"></empTransfer>
   </div>

   
    
   
</template>
<script>
import request from '@/utils/request'
import {SysMixin} from '@/mixins/SysMixin'
import ExtForm from '@/components/lt/codeGenerator/components/ExtForm'
import pageSetting from '@/components/lt/codeGenerator/pageSetting'
import defaultSettings from '@/config/defaultSettings'
import drEmpSelect from '@/views/system/dr/drEmpSelect'
import empTransfer from '@/views/system/emp/empTransfer'
import pick from 'lodash.pick'
import flowSetting from '../../flow/flowSetting'

export default {
    name:'ExtFlow',
    mixins:[SysMixin],
    components:{ExtForm,drEmpSelect,empTransfer},
    props:{
        componentRef:[String,Number],
    },
    data(){
        return{
            defaultSettings,
            flowSetting,
            flowParam:null,
            model:{},
            pageSetting,
            formfields:[
                {field:'pass',label:'是否通过',hide:false,component:pageSetting.常量.表单组件类型.下拉选择,initialValue:'1',dictCode:defaultSettings.数据字典.是否,rules: [{ required: false, message: '不能为空!' }]},
                {field:'nodeAssigneeRole',label:'角色选择',hide:false,component:pageSetting.常量.表单组件类型.下拉选择,dictCode:defaultSettings.数据字典.角色,rules: [{ required: true, message: '不能为空!' }]},
                {field:'nodeAssigneeEmpName',label:'审批人',hide:false,component:pageSetting.常量.表单组件类型.输入选择框,rules: [{ required: true, message: '不能为空!' }]},
                {field:'approvalOpinion',label:'审批意见',hide:false,component:pageSetting.常量.表单组件类型.多行文本,dictCode:defaultSettings.数据字典.角色,rules: [{ required: true, message: '不能为空!' }]},
           
           ],
            assigneeEmpNameArr:[],
            assigneeEmpNoArr:[],
            approvalOpinions: [],//审批意见
        }
    },
   
    created(){
        
    },
    mounted(){
        
    },
    methods:{
        getFlowParam(){
            let that=this
            let flag = false
            this.$refs.flowForm.getForm().validateFields((err, values) => {
                
                if (!err) {
                    flag = true
                    let formData = Object.assign(that.model, values);
                    that.flowParam.currentNodeAttribute.nodeAssigneeEmpName = formData["nodeAssigneeEmpName"]
                    that.flowParam.currentNodeAttribute.nodeAssigneeRole = formData['nodeAssigneeRole']
                    that.flowParam.approvalOpinion = formData['approvalOpinion']
                    that.flowParam.pass = formData['pass']
                    return that.flowParam
                }else{
                    flag = false
                }
           })
      
            if(flag){
                return that.flowParam
            }
            return null
        },
        setModel(){
            this.$nextTick(() => {
                this.$refs.flowForm.getForm().setFieldsValue(pick(this.model,'nodeAssigneeRole','approvalOpinion','nodeAssigneeEmpName','pass'))
                this.setFlowForm()
           })
        },
        setFlowForm(){
            let currentNodeAttribute = this.flowParam.currentNodeAttribute
            if(currentNodeAttribute.nodeAssigneeMode==flowSetting.constant.指定角色){
                this.formfields[2].hide=true
                this.formfields[1].disabled=true
            }else if(currentNodeAttribute.nodeAssigneeMode==flowSetting.constant.指定人员){
                this.formfields[1].hide=true
                this.formfields[2].disabled=true
            }else if(currentNodeAttribute.nodeAssigneeMode==flowSetting.constant.动态人员){
                this.formfields[1].hide=true
            }else if(currentNodeAttribute.nodeAssigneeMode==flowSetting.constant.动态角色){
                this.formfields[2].hide=true
            }else if(currentNodeAttribute.nodeAssigneeMode==flowSetting.constant.程序赋值){
                this.formfields[1].hide=true
                this.formfields[2].hide=true
            }

            if(this.flowParam.startNode==this.flowParam.currentNodeAttribute.nodeNo){
                this.formfields[0].hide=true
                this.formfields[3].hide=true
            }

            //判断此节点后面环节是否只剩下结束，或者是结束加返回，如果满足，则将审批人隐藏
            let jumpArr = this.flowParam.currentNodeJump
            if(jumpArr && jumpArr.length>0){
                let jump = jumpArr.find(item=>{
                    return ('结束'!=item.endNodeLabel && "1"!=item.isReturn)
                })
                if(!jump){
                    this.formfields[1].hide=true
                    this.formfields[2].hide=true
                }
                
            }
        },
        workFlowStart(templateNo){
            let that = this
            request.get('/SysFlowController/init',{params:{templateNo:templateNo}}).then((res)=>{
                if (res.success) {
                    that.flowParam = res.result
                    that.model={}
                    that.model["nodeAssigneeEmpName"] = that.flowParam.currentNodeAttribute.nodeAssigneeEmpName
                    that.model['nodeAssigneeRole'] = that.flowParam.currentNodeAttribute.nodeAssigneeRole
                    that.model['approvalOpinion'] = that.flowParam.approvalOpinion||''
                    that.model['pass'] = that.flowParam.pass || '1'
                    that.setModel()
                    
                    // console.log(that.flowParam,that.model)
                } else {
                    that.$message.warning(res.message)
                }
            })
        },
        workFlowHandle(taskId){
            let that = this
            request.get('/SysFlowController/getCurrentTask',{params:{taskId:taskId}}).then((res)=>{
                if (res.success) {
                    if(!res.result){
                        // that.$message.warning('任务信息不存在，请确定任务ID是否正确')
                        return
                    }
                    that.flowParam = res.result
                    that.model={}
                    that.model["nodeAssigneeEmpName"] = that.flowParam.currentNodeAttribute.nodeAssigneeEmpName
                    that.model['nodeAssigneeRole'] = that.flowParam.currentNodeAttribute.nodeAssigneeRole
                    that.model['approvalOpinion'] = that.flowParam.approvalOpinion||''
                    that.setModel()
                    
                    // console.log(that.flowParam,that.model)

                    //查询审批记录
                    that.getApprovedFlowTaskHis(that.flowParam.instanceId)
                } else {
                    that.$message.warning(res.message)
                }
            })
        },
         getApprovedFlowTaskHis(instanceId){
            let that = this
            request.get('/SysFlowController/getApprovedFlowTaskHis',{params:{instanceId:instanceId}}).then((res)=>{
                if (res.success) {
                    if(!res.result){
                        return
                    }
                    that.approvalOpinions = res.result
                } else {
                    that.$message.warning(res.message)
                }
            })
        },
        changeEventHandler(item){
            if(item["pass"]){
                if(item["pass"]=='0'){
                    this.formfields[1].hide=true
                    this.formfields[2].hide=true
                }else{
                    this.formfields[1].hide=false
                    this.formfields[2].hide=false
                    this.setFlowForm()
                }
            }
          
        },
        /**
         * 根据人员指派模式，动态隐藏和显示
         */
        setHowHideByAssigneeMode(val){
            
        },
        clickEventHandler(field,form){
            if("nodeAssigneeEmpName"==field){
                this.$refs.empTransfer.edit()
            }
            
        },
        onSingleEmpSelect(record){
            this.model["nodeAssigneeEmpName"] = record.empName
            this.model["nodeAssigneeEmpNo"] = record.empNo
            this.flowParam.currentNodeAttribute["nodeAssigneeEmpName"] = record.empName
            this.flowParam.currentNodeAttribute["nodeAssigneeEmpNo"] = record.empNo
            this.$refs["flowForm"].getForm().setFieldsValue({"nodeAssigneeEmpName":record.empName})
        },
        onMoreEmpSelect(dataSource){
            let that = this
            if(!dataSource || dataSource.length==0){
                that.$message.warning("请先选择人员信息");
                return false;
            }
            if(that.model["nodeAssigneeEmpName"]){
                that.assigneeEmpNameArr.push(that.model["nodeAssigneeEmpName"])
            }

            if(that.model["nodeAssigneeEmpNo"]){
                that.assigneeEmpNoArr.push(that.model["nodeAssigneeEmpNo"])
            }
            dataSource.forEach(function (item) {
                that.assigneeEmpNameArr.push(item.empName)
                that.assigneeEmpNoArr.push(item.empNo)
            })
            that.assigneeEmpNameArr = Array.from(new Set(that.assigneeEmpNameArr))
            that.assigneeEmpNoArr = Array.from(new Set(that.assigneeEmpNoArr))
            that.model["nodeAssigneeEmpNo"] =  that.assigneeEmpNoArr.join(',')
            that.model["nodeAssigneeEmpName"] = that.assigneeEmpNameArr.join(',')
            that.flowParam.currentNodeAttribute["nodeAssigneeEmpName"] = that.model["nodeAssigneeEmpName"]
            that.flowParam.currentNodeAttribute["nodeAssigneeEmpNo"] = that.model["nodeAssigneeEmpNo"]
            that.$refs["flowForm"].getForm().setFieldsValue({"nodeAssigneeEmpName":that.model["nodeAssigneeEmpName"]})
        }
    }
}
</script>